<script type="text/html" data-help-name="ui-button">
    <p>Adds a button to the user interface.</p>
    <p>
        Clicking the button generates a message with <code>msg.payload</code>
        set to the <b>Payload</b> field, and <code>msg.topic</code> to the <b>Topic</b> field.
    </p>
    <h3>Properties</h3>
    <dl class="message-properties">
        <dt>Icon <span class="property-type">string</span></dt>
        <dd>Renders a Material Design icon within the button. We use the Material Design Icons, you can see a full list of the available icons <a href="https://pictogrammers.com/library/mdi/">here</a>. There is no need to include the "mdi-" prefix, just the name of the icon.</dd>
        <dt>Icon Position<span class="property-type">left | right</span></dt>
        <dd>If "Icon" is defined, this property controls which side of the "Label" the icon will render on</dd>
        <dt>Label <span class="property-type">string</span></dt>
        <dd>The text shown within the button. If not provided, then the button will only render the icon</dd>
        <dt>Emulate Button Click <span class="property-type">bool</span></dt>
        <dd>If enabled, any received message will trigger a button click, emitting the relevant payload and topic</dd>
    </dl>
    <h3>Dynamic Properties (Inputs)</h3>
    <p>Any of the following can be appended to a <code>msg.</code> in order to override or set properties on this node at runtime.</p>
    <dl class="message-properties">
        <dt class="optional">class <span class="property-type">string</span></dt>
        <dd>Add a CSS class, or more, to the Button at runtime.</dd>
    </dl>
</script>
